<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <title>User List</title>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.1/css/bootstrap.min.css">
</head>
<style>
    .inline-container {
        display: inline-block;
    }
</style>

<body>
    <div class="container">
        <div class="card text-start" style="margin-top: 100px;">
            <div class="card-body">
                <h4 class="card-title">书籍一览</h4>
                <p class="card-text">
                <div class="inline-container">
                    <a th:href="@{/books/add}" class="btn btn-success">添加书籍</a>
                    <a th:href="@{/}" class="btn btn-secondary">退出</a>
                </div>

                <div class="inline-container" style="padding-left:400px">
                    <form th:action="@{/books/search}" method="get">
                        <input type="text" name="keyword" placeholder="输入关键字搜索">
                        <button type="submit" class="btn btn-outline-primary">搜索</button>
                    </form>
                </div>
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>书名</th>
                            <th>分类</th>
                            <th>价格</th>
                            <th>出版社</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr th:each="book : ${books}">
                            <td th:text="${book.id}"></td>
                            <td th:text="${book.name}"></td>
                            <td th:text="${book.category}"></td>
                            <td th:text="${book.price}"></td>
                            <td th:text="${book.publisher}"></td>
                            <td>
                                <a th:href="@{/books/{id}/edit(id=${book.id})}" class="btn btn-primary">编辑</a>
                                <a th:href="@{/books/{id}/delete(id=${book.id})}" class="btn btn-danger">删除</a>
                            </td>
                        </tr>
                    </tbody>
                </table>
                </p>
            </div>
        </div>





    </div>
</body>

</html>